<template>
	<div>
		<van-row style="width: 100%;height: 30vh;">
			<van-col span="24" style="height: 30vh;background-color: #323233;">
				<van-row style="width: 100%;height: 6vh;">
					<van-col span="18" style="height: 6vh;"></van-col>
					<van-col span="3" style="height: 6vh;">
						<van-icon name="service-o" color="#fff" size="20" style="margin-top: 3vh;"/>
					</van-col>
					<van-col span="3" style="height: 6vh;">
						<van-icon name="setting-o" color="#fff" size="20" style="margin-top: 3vh;" @click="entermineset"/>
					</van-col>
				</van-row>
				<van-row style="width: 100%;height: 15vh;">
					<van-col span="21" v-if="usernews">
						<van-col span="8" style="height: 15vh;">
							<van-image
							  round
							  width="6rem"
							  height="6rem"
							  :src="usernews.headerImg" style="margin-left: 15%;"
							/>
						</van-col>
						<van-col span="13" style="height: 15vh;">
							<van-row style="width: 100%;height: 8vh;">
								<van-col span="24" style="width:100%;height: 8vh;line-height: 6vh;color: #FFFFFF;text-align: left;padding-left: 10px;">{{usernews.nickName}}</van-col>
							</van-row>
							<van-row style="width: 100%;height: 7vh;">
								<van-col span="24" style="width:100%;height: 7vh;line-height: 7vh;color: #FFFFFF;text-align: left;padding-left: 10px;font-size: 14px;">{{usernews.nickName}}&nbsp;&nbsp;&nbsp;萧瑟银发</van-col>
							</van-row>
						</van-col>
					</van-col>
					<van-col v-else span="21">
						<button style="margin-top: 4vh;" @click="gologin()">请先登录</button>
					</van-col>
					<van-col span="3" style="height: 15vh;">
						<van-icon name="arrow" size="25" color="#fff" style="margin-top: 4vh;"/>
					</van-col>
				</van-row>
				<van-row style="width: 100%;height: 9vh;">
					<van-col span="8" style="height: 9vh;">
						<div style="width: 100%;height: 5vh;line-height: 5vh;color: #FFFFFF;">
							68
						</div>
						<div style="width: 100%;height: 4vh;line-height: 2vh;color: #FFFFFF;font-size: smaller;">
							关注
						</div>
					</van-col>
					<van-col span="8" style="height: 9vh;">
						<div style="width: 100%;height: 5vh;line-height: 5vh;color: #FFFFFF;">
							0
						</div>
						<div style="width: 100%;height: 4vh;line-height: 2vh;color: #FFFFFF;font-size: smaller;">
							粉丝
						</div>
					</van-col>
					<van-col span="8" style="height: 9vh;">
						<div style="width: 100%;height: 5vh;line-height: 5vh;color: #FFFFFF;">
							85
						</div>
						<div style="width: 100%;height: 4vh;line-height: 2vh;color: #FFFFFF;font-size: smaller;" @click="collect()">
							收藏
						</div>
					</van-col>
				</van-row>
			</van-col>
		</van-row>
	</div>
</template>

<script>
	export default {
		data(){
			return{
				usernews:[]
			}
		},
		created() {
			let usernews = JSON.parse(localStorage.getItem('usernews'))
			console.log(usernews)
			this.usernews = usernews
		},
		methods:{
			gologin(){
				this.$router.push({path:'/login'})
			},
			entermineset(){
				this.$router.push({path:'/mineset'})
			},
			collect(){
				this.$router.push({path:'/collect'})
			}
		}
	}
</script>

<style>
</style>
